<template>
  <ul class="typeList">
    <li
      v-for="(item,index) in typeList"
      :key="index"
      :class="typeIndex === item.type?'current':''"
      @click="$emit('clickType',item)"
    >{{item.lable}}</li>
  </ul>
</template>
<script>
export default {
    props:{
        typeIndex:{
          type:String
        },
        typeList:{
            type:Array,
            default:[]
        }
    },
}
</script>
<style lang="scss" scoped>
.typeList {
  position: absolute;
  top: 0;
  right: 0;
  list-style: none;
  z-index: 9;
  padding: 0;
  margin: 0;
  li {
    display: inline-block;
    font-size: 14px;
    color: #333333;
    margin: 0 5px;
    padding: 5px 8px;
    border-radius: 5px;
    cursor: pointer;
    &.current {
      color: #ffffff;
      background: #409eff;
    }
  }
}
</style>